/*
  学习目标：hooks使用三个限制
  
 
 

*/

import { useState } from 'react';
import { React } from 'react';

const isShow = false;
const list = [1, 3];
export default function App() {
  const [count, setCount] = useState(99);
  if (isShow) {
    // 1. 不能在if else语句中使用hooks
    // const [msg, setMsg] = useState('hello React');
  }

  for (let i = 0; i < list.length; i++) {
    //  2. 不能在for语句中使用hooks
    // const [title, setTitle] = useState('123');
  }

  return (
    <div>
      <h1>{count}</h1>
      <button onClick={() => setCount(count + 1)}>点我+1</button>
    </div>
  );
}

// 3. 不能在普通函数中使用hooks
// 非普通函数：
//    1.  函数式组件： 首字母大写
//    2. 自定义hooks函数：use+驼峰命名的函数

// ❌普通函数
function hello() {
  // const [state, setState] = useState('123');
}

// ✅函数式组件
function Hello() {
  const [state, setState] = useState('123');
}

// ✅ 自定义hooks函数
function useHello(params) {
  const [state, setState] = useState('123');
}
